<template>
    <div class="qingwu">
        <div class="admin_table_page_title">
            <a-button @click="$router.back()" class="float_right" icon="arrow-left">返回</a-button>
            采集器添加
        </div>
        <div class="unline underm"></div>
        <div class="admin_form">
            <a-form-model :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
                <a-form-model-item label="采集器名称">
                    <a-input v-model="info.name"></a-input>
                </a-form-model-item>
                <a-form-model-item label="采集器编号">
                    <a-input v-model="info.code"></a-input>
                </a-form-model-item>
                <a-form-model-item label="区域">
                    <a-select v-model="info.community_id">
                        <a-select-option v-for="(v,k) in community_list" :key="k" :value="v.value"
                                         @click="chose_community(v.value, 0)">{{ v.label }}
                        </a-select-option>
                    </a-select>
                </a-form-model-item>
                <a-form-model-item label="分区">
                    <a-select v-model="info.area_id">
                        <a-select-option v-for="(v,k) in newAreaList" :key="k" :value="v.label"
                                         @click="chose_area(v.value, 1)">{{ v.label }}
                        </a-select-option>
                    </a-select>
                </a-form-model-item>
                <a-form-model-item label="楼号">
                    <a-select v-model="info.tower_id">
                        <a-select-option v-for="(v,k) in newTowerList" :key="k" :value="v.value">{{
                                v.label
                            }}
                        </a-select-option>
                    </a-select>
                </a-form-model-item>
                <a-form-model-item label="安装地址">
                    <a-input v-model="info.address"></a-input>
                </a-form-model-item>
                <a-form-model-item label="代理商">
                    <a-select v-model="info.agent_id">
                        <a-select-option v-for="(v,k) in agent_list" :key="k" :value="v.value">{{ v.label }}
                        </a-select-option>
                    </a-select>
                </a-form-model-item>

                <a-form-model-item :wrapper-col="{ span: 12, offset: 5 }">
                    <a-button type="primary" @click="handleSubmit">提交</a-button>
                </a-form-model-item>
            </a-form-model>

        </div>
    </div>
</template>

<script>
import moment from 'moment';

export default {
    components: {},
    props: {},
    data() {
        return {
            info: {
                adv_type: 0,
            },
            community_list: [],
            agent_list: [],
            newAreaList: [],
            newTowerList: [],
            id: 0,
            loading: false,
        };
    },
    watch: {},
    computed: {},
    methods: {
        moment,
        handleSubmit() {

            // 验证代码处
            if (this.$isEmpty(this.info.name)) {
                return this.$message.error('采集器名称不能为空');
            }
            if (this.$isEmpty(this.info.code)) {
                return this.$message.error('采集器编号不能为空');
            }


            let api = this.$apiHandle(this.$api.estateCollectorMeter, this.id);
            if (api.status) {
                this.$put(api.url, this.info).then(res => {
                    if (res.code == 200) {
                        this.$message.success(res.msg)
                        return this.$router.back();
                    } else {
                        return this.$message.error(res.msg)
                    }
                })
            } else {
                this.$post(api.url, this.info).then(res => {
                    if (res.code == 200) {
                        this.$message.success(res.msg)
                        return this.$router.back();
                    } else {
                        return this.$message.error(res.msg)
                    }
                })
            }


        },
        get_info() {
            this.$get(this.$api.estateCollectorMeter + '/' + this.id).then(res => {
                this.info = res.data;
            })
        },
        // 获取菜单列表
        onload() {
            // 判断你是否是编辑
            if (!this.$isEmpty(this.$route.params.id)) {
                this.id = this.$route.params.id;
                this.get_info();

            }
            this.get_agent();
            this.$get(this.$api.estateCollectorMeter, {per_page: 100}).then(res => {
                this.list = res.data.data;
            });

        },
        time_format(val) {
            this.info.adv_start = moment(val[0]._d).format("YYYY-MM-DD HH:mm:ss")
            this.info.adv_end = moment(val[1]._d).format("YYYY-MM-DD HH:mm:ss")
            this.$forceUpdate();
        },
        get_agent() {
            this.$get(this.$api.estateGetAgent).then(res => {
                this.data = res.data;
                this.community_list = this.data.community_arr;
                this.agent_list = this.data.agent_arr;
                console.log(this.community_list);
                console.log(this.area_list);
            })
        },
        /**
         * 选择区域
         */
        chose_community(id) {
            this.newAreaList = [];
            this.data.area_arr.forEach(item => {
                if (item.c_id == id) {
                    this.newAreaList.push(item);
                }
            })

            this.$forceUpdate();
        },
        /*
            选择分区
         */
        chose_area(id) {
            this.newTowerList = [];
            this.data.tower_arr.forEach(item => {
                if (item.area_id == id) {
                    this.newTowerList.push(item)
                }
            })
            this.$forceUpdate();
        }

    },

    created() {
        this.onload();
    },
    mounted() {
    }
};
</script>
<style lang="scss" scoped>

</style>
